<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@taglib uri="http://www.springframework.org/tags" prefix="spring"%>
<!-- ############################# Ajax Page Container ############################# -->
<section id="page" data-title="Locale - ${utente.nomeLocale}">

	<!-- ############################# Intro ############################# -->
	<section class="intro-title section border-bottom" style="background-image: url(${pageContext.request.contextPath}/${back.url})">
		<h2 class="heading-l event-heading" style="color: red;text-shadow: 3px 2px white;z-index: 2;">${utente.nomeLocale}</h2>
		<!-- Overlay -->
		<!-- <span class="overlay dots"></span> -->
	</section>
	<!-- /intro -->

	<!-- ############################# Content ############################# -->
	<section class="content section">
		<!-- container -->
		<div class="container">

			<!-- ############################# Single Release ############################# -->
			<!-- Sidebar -->
			<div class="sidebar main-left main-medium">
				<!-- Widgets -->
				<!-- Details widget -->
				<div class="widget details-widget">
					
					<div class="details-meta">
						<!-- Details list -->
						<ul class="details-list">
							<li>
								<span class="label">Nome Locale</span>
								<div class="data"><b>${utente.nomeLocale}</b></div>
							</li>
							<li>
								<span class="label">Generi</span>
								<div class="data"> Tipologia</div>
							</li>
							<li>
								<span class="label">Address</span>
								<div class="data">${utente.indirizzo}</div>
							</li>
						</ul>
					</div>
					<!-- Details Share -->
					<div class="details-social-box">
						<a href="${canali.facebook}" class="facebook-share"><i class="icon icon-facebook"></i></a>
						<a href="${canali.youtube}" class="twitter-share"><i class="icon icon-twitter"></i></a>
						<a href="${canali.googlePlus}" class="googleplus-share"><i class="icon icon-googleplus"></i></a>
					</div>
				</div>

			
			
			</div>
			<!-- /sidebar -->

			<!-- Main -->
			<div id="main" class="release main-left main-medium">

				<!-- Article -->
				<article>
					<!-- Carousel slider -->
					<div id="blog-slider01" class="carousel-slider" data-effect="fadeUp" data-pagination="true" data-nav="true">
						<!-- Slide -->
						<c:forEach items="${slideshow}" var="slideshow">
							<div class="slide">
							<img src="${pageContext.request.contextPath}/${slideshow.url}" alt="Event Image">
							</div>
						</c:forEach>
						
						<!-- /slide -->
						
					</div>
					<!-- /Carousel slider -->
					<br>
					<h2>Bio</h2>
					<p>
						${utente.descrizione}
					</p>
					
					<br>
					<h2>Prossimi Eventi</h2>
					<ul class="lineup">
					<c:forEach items="${eventi}" var="eventi">
						<li>
							<div class="lineup-time">${eventi.data}</div>
							<div class="lineup-artist"><a href="javascript:;">${eventi.nome}</a> - <a class="gruppo" href="javascript:;">${eventi.gruppo.nomeGruppo}</a></div>
						</li>
					</c:forEach>
						
						
					</ul>

					<br>

					<h2>Dove</h2>
					<div id="location-map" class="gmap map" data-address="${utente.indirizzo}" data-zoom="18" data-zoom_control="true" data-scrollwheel="true"></div>
				</article>
				<!-- /article -->

				
			</div>
			<!-- /main -->
		</div>
		<!-- /container -->
	</section>
	<!-- /Content -->

	<!-- ############################# Comment section ############################# -->
	<section class="comments-section section border-top">
		<!-- container -->
		<div class="container">

			<h4 class="comments-title">Comments:</h4>		
			<!-- Comments list -->

			<!-- Comments list -->
			<ol class="comments-list">

				<!-- Comment -->
				<li class="comment">
					<article>
						<div class="avatar">
							<img src="http://www.gravatar.com/avatar/00000000000000000000000000000000?d=mm&amp;s=50" alt="Image">
						</div>
						<div class="comment-meta">
							<h5 class="author"><a href="#">John Themeforest</a></h5>
							<p class="date">October 11, 2012</p>
						</div>
						<div class="comment-body">
							<p>Pellentesque sollicitudin, magna ac ullamcorper interdum, purus urna condimentum ligula, sed volutpat erat felis a lectus. Sed et consectetur nisi. In consectetur turpis in quam rutrum tempor.</p>
						</div>
					</article>
					<!-- Children comments -->
					<ul class="children">
						<li class="comment">
							<article>
								<div class="avatar">
									<img src="http://www.gravatar.com/avatar/00000000000000000000000000000000?d=mm&amp;s=50" alt="Image">
								</div>
								<div class="comment-meta">
									<h5 class="author"><a href="#">John Themeforest</a></h5>
									<p class="date">October 11, 2012</p>
								</div>
								<div class="comment-body">
									<p>Pellentesque sollicitudin, magna ac ullamcorper interdum, purus urna condimentum ligula, sed volutpat erat felis a lectus. Sed et consectetur nisi. In consectetur turpis in quam rutrum tempor.</p>
								</div>
							</article>
						</li>
					</ul>
					<!-- Children comments -->
				</li>
				<!-- /Comment -->
				<!-- Comment -->
				<li class="comment">
					<article>
						<div class="avatar">
							<img src="http://www.gravatar.com/avatar/00000000000000000000000000000000?d=mm&amp;s=50" alt="Image">
						</div>
						<div class="comment-meta">
							<h5 class="author"><a href="#">John Themeforest</a></h5>
							<p class="date">October 11, 2012</p>
						</div>
						<div class="comment-body">
							<p>Pellentesque sollicitudin, magna ac ullamcorper interdum, purus urna condimentum ligula, sed volutpat erat felis a lectus. Sed et consectetur nisi. In consectetur turpis in quam rutrum tempor.</p>
						</div>
					</article>
				</li>
				<!-- /Comment -->
				<!-- Comment -->
				<li class="comment">
					<article>
						<div class="avatar">
							<img src="http://www.gravatar.com/avatar/00000000000000000000000000000000?d=mm&amp;s=50" alt="Image">
						</div>
						<div class="comment-meta">
							<h5 class="author"><a href="#">John Themeforest</a></h5>
							<p class="date">October 11, 2012</p>
						</div>
						<div class="comment-body">
							<p>Pellentesque sollicitudin, magna ac ullamcorper interdum, purus urna condimentum ligula, sed volutpat erat felis a lectus. Sed et consectetur nisi. In consectetur turpis in quam rutrum tempor.</p>
						</div>
					</article>
				</li>
				<!-- /Comment -->
			</ol>
			<!-- /Comments list -->

			
			<h4 class="response-title">Post New Comment:</h4>
			<!-- response form -->
	        <form method="post" class="form response-form">
	        	<div class="row clearfix">
	 				<div class="col-1-3">
	 					<label for="response-name"><strong>Name</strong> (required)</label>
						<input type="text" name="name" value="" id="response-name" required>
	 				</div>
	 				<div class="col-1-3">
	 					<label for="response-email"><strong>Email</strong> (required)</label>
						<input type="email" name="email" value="" id="response-email" required>
	 				</div>
	 				<div class="col-1-3 last">
	 					<label for="response-www"><strong>Webiste</strong> (WWW)</label>
						<input type="text" name="subject" value="" id="response-www">
	 				</div>
	        	</div>
	        	<div class="row clearfix">
	        		<div class="col-1-1">
	        			<label for="response-comment"><strong>Comment</strong> (required)</label>
						<textarea name="comment" id="response-comment" cols="88" rows="6" required></textarea>
					</div>
	        	</div>
				<input type="submit" value="Submit Comment" class="large invert">
				<div class="clear"></div>
	        </form>
	        <!-- /response form -->
		</div>	
		<!-- /container -->
	</section>
	<!-- /section -->

</section>
<!-- /page -->